<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>
    <!-- <ul> 
        <li><a href="#/">index</a></li> 
        <li><a href="#/page1">page1</a></li> 
        <li><a href="#/page2">page2</a></li> 
    </ul> 
    <p class="text"></p>     -->
    <a href="#index">首页</a>
    <a href="#detail/1654499">详情页</a>
</body>
</html>
<script>
// function Router(){
//     this.routers = {}
//     this.currentUrl = ''
// }
// Router.prototype.route = function(path,callback){
//     this.routers[path] = callback || function(){}
// }
// Router.prototype.refresh = function(){
//     this.currentUrl = location.hash.slice(1) || '/'
//     this.routers[this.currentUrl]()
// }
// Router.prototype.init = function(){
//     console.log(this)
//     window.addEventListener('load',this.refresh.bind(this),false);
//     window.addEventListener('hashchange',()=>{
//         this.refresh()
//         console.log(this)
//     },false);
// }
// window.Router = new Router();
// window.Router.init();
</script>
<script>
;(function(global,factory){
    if(typeof define === 'function' && (define.amd || define.cmd)){
        define(function(global){
             return factory(global)
        })
    }else if (typeof module === 'object' && typeof module.exports === 'object') {
        //CommonJS
        module.exports = factory(global);
    } else {
        //Browser
        global.Router = factory(global);
    }
}(typeof window !== 'undefined'? window :this,function(window){
   var Router  = {
       hashList:{},
       index:null,
       add:function(path,callabck){
           this.hashList[path] = callabck;
       },
       go:function(path){
           window.location.hash = '#' + path;
       },
       remove:function(path){
          delete this.hashList[path]
       },
       reload:function(){
           var self = this;
           var hash = window.location.hash.replace('#','')
           var addr = hash.split('/')[0]
           var cb = self.getCb(addr,self.hashList)
           if(cb != false){
               var arr = hash.split('/')
               arr.shift()
               cb.apply(self,arr)
           }else{
               self.index && self.go(self.index)
           }
       },
       setIndex:function(index){
          this.index = index
       },
       getCb:function(addr,hashList){
          for(var key in  hashList){
             if(key == addr){
                return hashList[key]
             }
          }
       },
       init:function(options){
          var self = this
          window.onhashchange = function(){
              self.reload()
          }
       },
       start:function(){
           this.reload()
       }
   }
   return Router
}))
</script>
<script>
 
    // var text = document.querySelector('.text');
    // Router.route('/', function() {
    //     text.innerHTML = '这里是首页';
    // });
    // Router.route('/page1', function() {
    //     text.innerHTML = '这里是page1';
    // });
    // Router.route('/page2', function() {
    //     text.innerHTML = '这里是page2';
    // });


    Router.init();
    Router.add('index', function() {
        alert('这里是首页的内容');
        });
    
    // Router.add('detail', function(id) {
    //     alert('这里是详情页，id为'+id);
    // });
    // Router.setIndex('index'); //设置首页
    // Router.start();
</script>
<script>

</script>